// 退出登录按钮
import React, { useState, useEffect } from "react";
import {Button, Checkbox, Form, Input, Modal, message} from 'antd'
import { Link, useRouter } from 'next/router';
import axios from 'axios';
import { data } from "autoprefixer";
const LogOut = () => {
    const router = useRouter();
    //展开对话框
    const [isModalOpen, setIsModalOpen] = useState(false);

    const showModal = () => {
        setIsModalOpen(true);
     };
     // 处理退出登录
    const handleLogout = async () => {
        // token 存储在 localStorage 中
        const token = localStorage.getItem('token');

        try {
            // 发起请求到后端退出登录接口
            const response = await axios.get('/api/user/logout', {
                headers: {
                    Authorization: `Bearer ${token}` // JWT 验证需要在请求头中携带 token
                }
            });

           
                localStorage.removeItem('token');// 清除 token 信息
                message.success(response.data.msg || '退出登录成功');
                // 跳转到登录页面
                router.push('/login');
            
        } catch (error) {
            // 处理错误情况
            console.error(error);
            message.error('退出登录失败');
        }
    };

    const handleOk = () => {
        setIsModalOpen(false);
        handleLogout();
    };

  const handleCancel = () => {
    setIsModalOpen(false);
  };

  

return (
    <>
      <Button type="primary" block onClick={showModal}>退出登录</Button>
      <Modal title="确定退出登录吗？" open={isModalOpen} onOk={handleOk} onCancel={handleCancel}>
      
    </Modal>
    </>
);
    };
  export default LogOut;